<template>
	<view class="intelligent">
		<view class="status_bar"></view>
		<intel-header class="header" :state='false'></intel-header>
		<template v-for="irri in getirris">
			<intel-irri-area 
				class="area"
				@close="deleteIrrigation"
				@timer-start ="timerStart"
				@timer-add = "timerAdd"
				@limit-start = 'limitStart'
				:irri-id="irri.id"
				:name="irri.name"
				:valves="irri.valves"
				></intel-irri-area>
		</template>
		<image class="add" src="/static/image/mipmap-xhdpi/add.png" mode="" @click="addIrrigationArea"></image>
		<button class="turn" type="default" @click="toIrrigationSetting">轮灌</button>
	</view>
</template>

<script>
	import {mapState, mapActions} from 'vuex';
	import intelHeader from './components/intel-header.vue'
	import IntelIrriArea from './components/intel-irri-area.vue'
	export default {
		data() {
			return {
			};
		},
		methods:{
			toIrrigationSetting(){
				uni.navigateTo({
					url: '/pages/setting/setting',
					success(e) {
						console.log('成功',e)
					},
					fail(e) {
						console.log('失败', e)
					}
				})
			},
			addIrrigationArea() {
				console.log('addIrrigationArea')
			},
			deleteIrrigation() {
				console.log('deleteIrrigation')
			},
			timerStart() {
				console.log('timerStart')
			},
			timerAdd() {
				console.log('timerAdd')
			},
			limitStart() {
				console.log('limitStart')
			},
			...mapActions('device', ['setDeviceRelaySelected'])
		},
		computed:{
			...mapState('device', ['devices']),
			...mapState('irrigation', ['irrigations', 'groups']),
			getirris(){
				let irs = this.irrigations.map(irri => {
					let valves = [];
					irri.groups.map(group => {
						if(group.rotationRelays){
							group.rotationRelays.map( relay => {
								let device = this.devices.find(dev => dev.id == relay.facId)
								if(!!device){
									let valve = device.valves.find(val => val.num === relay.relay)
									if(!!valve){
										this.setDeviceRelaySelected({
											valve, selected:true
										})
										valves.push( {
											groupId: group.id,
											facId: device.id,
											num: valve.num,
											name: valve.name,
											switch: valve.state,
											power: 100,
											signal: 31,
											state: ''
										} )
									}
								}
							})
						}
					})
					return {
						id: irri.id,
						name: irri.name,
						valves: valves
					}
				})
				return irs
			}
		},
		components:{
			intelHeader,
			IntelIrriArea
		},
		onShow() {
			console.log('intelligent onShow')
		},
	}
</script>

<style lang="scss" scoped>
.intelligent{
	box-sizing: border-box;
	.header{
		margin-bottom: 21.17rpx;
	}
	.area{
		margin-bottom: 23.52rpx;
	}
	.add{
		display: block;
		width: 700rpx;
		height: 305.88rpx;
		margin: 0 auto 23.52rpx;
	}
	.turn{
		width: 609.41rpx;
		height: 76.47rpx;
		background: #207A6E;
		border-radius: 11.76rpx;
		
		font-size: 35.29rpx;
		font-family: SourceHanSansCN;
		font-weight: bold;
		color: #FFFFFF;
	}
}
</style>
